﻿@{
    ViewBag.Title = "用户登录";
    Layout = null;
}
<div id="user_login_container" class="container">
    <form id="user_login_from" method="POST">
        <table cellpadding="5">
            <tr>
                <th>
                    用户名:
                </th>
                <td>
                    <input id="user_login_from_account" name="Account" type="text" />
                </td>
            </tr>
            <tr>
                <th>
                    密码:
                </th>
                <td>
                    <input id="user_login_from_password" name="PassWord" type="password" />
                </td>
            </tr>
            <tr id="user_login_image" style="display: none;">
                <th>
                    验证码:
                </th>
                <td>
                    <input id="user_login_from_code" name="Captcha" type="text" style="width: 40px;" />
                    <img id="user_login_from_image" src="" alt="验证码" style="vertical-align: middle" />
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <a id="user_login_from_submit" style="margin-right: 10px;" href="javascript:;"></a>
                    <a id="user_login_from_cancel" href="javascript:;"></a>
                </td>
            </tr>
        </table>
    </form>
</div>

<script type="text/javascript">
    Oneworks.CreatePage("UserLogin", {
        settings: {
            captcha: '/File/LoginCode',
            login: '/User/Login',
            errorUrl: '/Api/User/ErrorCount',
            errorCount: 0            
        },
        controls: {
            container: $('#user_login_container'),
            form: $('#user_login_from'),
            account: $('#user_login_from_account'),
            password: $('#user_login_from_password'),
            boximage: $('#user_login_image'),
            code: $('#user_login_from_code'),
            image: $('#user_login_from_image'),
            submit: $('#user_login_from_submit'),
            cancel: $('#user_login_from_cancel')
        },
        events: {
            onRefreshCaptcha: function () {
                Oneworks.page['UserLogin'].controls.image.attr('src', Oneworks.page['UserLogin'].settings.captcha);
            },
            onSubmit: function () {
                Oneworks.page['UserLogin'].controls.form.submit();
            },
            onChangeLoginStatus: function (fun) {
                var that = Oneworks.page['UserLogin'],
                            value = that.controls.account.val(),
                            events = that.events,
                            controls = that.controls;
                if (value != '') {
                    $.get(that.settings.errorUrl, { value: value }, function (data) {
                        if (data) {
                            var error = parseInt(data.ErrorCount);
                            if (error > 2) {
                                events.onRefreshCaptcha();
                                controls.boximage.show();                                
                            }
                            fun(error);
                        }
                    });
                }
            },
            onSuccess: function () {
            },
            onFailure: function () {
            },
            onClose:function (){}
        }
    }, function () {
        var that = this,
            controls = that.controls,
            settings = that.settings,
            events = that.events;
        controls.init = function () {
            controls.form.form({
                url: settings.login,
                onSubmit: function () {
                    var isValid = controls.form.form('validate');
                    if (isValid)
                        controls.container.Easyui().mark();
                    return isValid;
                },
                success: function (data) {
                    var r = $.parseJSON(data);
                    events.onChangeLoginStatus();
                    if (r.Status == 1) {
                        controls.form.form('clear');
                        events.onSuccess(r);
                    } else {
                        events.onFailure(r);
                    }
                    controls.container.Easyui().mark(true);
                }
            });
            controls.submit.linkbutton({ text: '登录' });
            controls.cancel.linkbutton({ text: '取消' });
            controls.account.validatebox({ required: true, validType: 'length[4,20]' });
            controls.password.validatebox({ required: true, validType: 'length[4,20]' });
            var p = controls.container.parent(),
                  h = p.height(),
                  w = p.width();
            controls.container.css({
                width: w,
                height: h
            });
        };
        events.init = function () {
            controls.image.click(function () {
                that.events.onRefreshCaptcha();
            });
            controls.submit.click(function () {

                that.events.onSubmit();
            });
            controls.cancel.click(function () {
                that.events.onClose();
            });
            controls.account.focusout(function () {
                that.events.onChangeLoginStatus();
            });
        };
        controls.init();
        events.init();
    });
</script>
